    <?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html 
  PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
  <title>DueDates HomePage</title>
  <!-- do not remove these! -->
  <link rel="stylesheet" type="text/css" href="./GlobalStyle.css" />
  <link rel="stylesheet" type="text/css" href="./HomePage.css" />
</head>

<body id="bodycontainer">

<div id="headercontainer">

  <!-- need a separate div because the contents have a different width than the headercontent div -->
  <div id="headercontent">
    <span id="headermaintext">DueDates-Akala</span><br />
    <span id="headersubtext">A Personal Library Management Tool</span>
  </div>
  
</div>

<div id="navbarcontainer">
  <!-- not sure what tab names we want -->
  <ul>
    <li><a href="#" id="currentpage">Home</a></li>
    <li><a wicket:id="alerts" href="#">Alerts</a></li>
    <li><a href="http://code.google.com/p/duedates-akala/">About</a></li>
    <li><a wicket:id="logout" href="#">Logout</a></li>
  </ul>
</div>

<div id="maincontentcontainer">

  <div id="welcomecontainer">
    <span>Welcome,</span> <span wicket:id="welcome">[username]</span>
  </div>

  <div id="librarylistcontainer">
    <table>
      <tr id="libraryheader">
        <td><span>Library Name</span></td>
        <td><span>Due in # days</span></td>
        <td><span>Action</span></td>
      </tr>
    
      <tr wicket:id="libraryrow" id="libraryrow">
        <td><span wicket:id="libraryname">[Library]</span></td>
        <form wicket:id="libraryform">
          <td><input wicket:id="filter" type="text" size="10" /></td>
          <td><input type="submit" value="Update" /></td>
        </form>
      </tr>
      
      <tr id="libraryfooter">
        <td><span>All Libraries</span></td>
        <form wicket:id="alllibrariesform">
          <td><input wicket:id="filter" type="text" size="10" /></td>
          <td><input type="submit" value="Update" /></td>
        </form>
      </tr>
    </table>
  </div><!--librarycontainer-->

  <div id="feedbackcontainer">
    <span wicket:id="feedback">[feedback]</span>
  </div><!--feedbackcontainer-->

  <div id="resultscontainer">
    <table wicket:id="resultstable">
      <tr>
        <td><span><a wicket:id="libraryhead" href="#">Library</a></span></td>
        <td><span><a wicket:id="titlehead" href="#">Title</a></span></td>
        <td><span><a wicket:id="duedatehead" href="#">Due Date</a></span></td>
      </tr>
      
      <tr wicket:id="resultsrow" id="resultsrow">
        <td><span wicket:id="library">[libname]</span></td>
        <td><span wicket:id="title">[title]</span></td>
        <td><span wicket:id="duedate">[duedate]</span></td>
      </tr>
    </table>
  </div><!--resultscontainer-->
  
</div><!--maincontentcontainer-->
</body>
</html>